<template>
  <div class="app">
    <div class="detail">
        <div class="header">
           <span @click="$router.go(-1)">←</span>
           <span>通知详情</span>
        </div>
        <div class="banner">
            <h1>{{title}}</h1>
            <el-divider />
            <p>{{content}}</p>
        </div>
    </div>
  </div>
</template>

<script setup>
import {useInformListStore} from '../stores/informlist'
import { useRoute,useRouter } from 'vue-router';
import { ref } from 'vue';
let $store= useInformListStore();
let $route=useRoute();
console.log('接收的数据',$route.query)

let title=ref('');
let content=ref('');


let i= $store.tableData.findIndex((element)=>{
    return element.id==$route.query.id
})
title.value= $store.tableData[i].title
content.value= $store.tableData[i].content
//返回
let $router=useRouter()
let goBack=()=>{
    $router.go(-1)
}
</script>

<style scoped>
*{
    margin: 0;
    padding: 0;
}
.header{
    width: 100%;
    height: 80px;
    padding-left: 40px;
    box-sizing: border-box;
    line-height: 70px;
    color: rgba(24,144,255,1);
    box-shadow: 5px 5px 5px #cecaca;
}
.header span{
    margin-right: 20px;
}
.banner{
    height: 150px;
    padding: 0 100px;
    line-height: 150px;
    text-align: center;
}
.banner p{
    line-height: 50px;
}
</style>